input.ui-huepicker-input, .ui-field-contain input.ui-huepicker-input {
	display: inline-block;
	width: 50px;
	background-image: none;
	padding: .4em;
	margin: .5em 0;
	line-height: 1.4;
	font-size: 16px;
	outline: 0;
}
.ui-field-contain input.ui-huepicker-input {
	margin: 0;
}
input.ui-huepicker-input, .ui-field-contain input.ui-huepicker-input {
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	-ms-box-sizing: content-box;
	box-sizing: content-box;
}
div.ui-huepicker {
	position: relative;
	display: inline-block;
	overflow: visible;
	height: 20px;
	padding: 0;
	margin: 0 2% 0 20px;
	top: 4px;
	width: 65%;
	border: 1px solid #333;
    background: #f00; /* Old browsers */
    background: -webkit-gradient(linear, left top, right top,
        color-stop(  0%          ,#f00),
        color-stop( 16.666666667%,#ff0),
        color-stop( 33.333333333%,#0f0),
        color-stop( 50%          ,#0ff),
        color-stop( 66.666666667%,#00f),
        color-stop( 83.333333333%,#f0f),
        color-stop(100%          ,#f00)); /* Chrome,Safari4+ */
    background: -moz-linear-gradient(left,
        #f00   0%, 
        #ff0  16.666666667%,
        #0f0  33.333333333%,
        #0ff  50%,
        #00f  66.666666667%,
        #f0f  83.333333333%,
        #f00 100%);
    background: -webkit-linear-gradient(left,
        #f00   0%, 
        #ff0  16.666666667%,
        #0f0  33.333333333%,
        #0ff  50%,
        #00f  66.666666667%,
        #f0f  83.333333333%,
        #f00 100%);
    background: -o-linear-gradient(left,
        #f00   0%, 
        #ff0  16.666666667%,
        #0f0  33.333333333%,
        #0ff  50%,
        #00f  66.666666667%,
        #f0f  83.333333333%,
        #f00 100%);
    background: -ms-linear-gradient(left,
        #f00   0%, 
        #ff0  16.666666667%,
        #0f0  33.333333333%,
        #0ff  50%,
        #00f  66.666666667%,
        #f0f  83.333333333%,
        #f00 100%);
    background: linear-gradient(left,
        #f00   0%, 
        #ff0  16.666666667%,
        #0f0  33.333333333%,
        #0ff  50%,
        #00f  66.666666667%,
        #f0f  83.333333333%,
        #f00 100%);
}
div.ui-huepicker-bg {
	border: none;
	height: 100%;
	padding-right: 8px;
}
.ui-controlgroup a.ui-huepicker-handle, a.ui-huepicker-handle {
	position: absolute;
	z-index: 1;
	top: 50%;
	width: 28px;
	height: 28px;
	margin-top: -15px;
	margin-left: -15px;
	outline: 0;
	border: 1px solid black;
	box-shadow: inset -1px -1px 4px 0px rgba(0, 0, 0, 0.3),
		inset 1px 1px 4px 0px rgba(255, 255, 255, 0.3);
}
a.ui-huepicker-handle .ui-btn-inner {
	padding: 0;
	height: 100%;
}
@media all and (min-width: 450px){
	.ui-field-contain label.ui-huepicker {
		vertical-align: top;
		display: inline-block;
		width: 20%;
		margin: 0 2% 0 0;
	}
	.ui-field-contain div.ui-huepicker {
		width: 43%;
	}
}	
.ui-huepicker-inneroffset {
	margin: 0 16px;
	position: relative;
	z-index: 1;
}
